{extend name="public/menu3" /}
{block name='title'}-{$cur.name}{/block}

{block name='content'}
<div class="right_content">
    <ul class="list">
        <!-- start -->
        {foreach $news as $k=>$v}
        {php}$newsid = $v['id'];{/php}
        <li>
            <div class="left">
                <a href='{:url("/newsdetails/$newsid")}'><p class="image"><img src="{$v.thumb ?: ''}" alt=""></p>
                    <p class="title">{$v.title ?: ''}</p></a>
            </div>
            <div class="content">
                <p>媒体链接：</p>
                <ul>
                    {foreach $v.link as $vl}
                    {notempty name='vl.status'}
                    <a href="{$vl.value ?: 'javascript:;'}"><li class="img"><img src="{$vl.thumb ?: ''}" alt=""></li></a>
                    {/notempty}
                    {/foreach}
                </ul>
            </div>
        </li>
        {/foreach}

        <!-- end -->
    </ul>
    <div id="page">

    </div>
</div>
</div>
{/block}

{block name='script'}
<script src="__STATIC__/index/js/jquery.page.js"></script>
<style>
    #content .list>li{
        display: flex;
        margin-bottom: 40px;
        padding: 20px;
        box-shadow: 0 0 5px #ddd;
    }

    #content .list>li:hover {
        box-shadow: 0 0 15px #ddd;
    }

    #content .list>li .left {
        margin-right: 20px;
    }

    #content .list>li .image {
        width: 270px;
        height: 200px;
    }

    #content .list>li .title {
        margin-top: 10px;
        width: 270px;
        font-size: 18px;
        line-height: 1.5;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        overflow: hidden;
        text-overflow: ellipsis;
        -webkit-box-orient: vertical;
    }

    #content .list>li .content {
        flex: 1;
        overflow: hidden;
        display: flex;
        flex-flow: column nowrap;
        justify-content: center;
    }

    #content .list>li ul {
        margin-top: 20px;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    #content .list>li ul li{
        margin: 20px;
    }
    #content .list>li ul .img {
        width: 100px;
        height: 100px;
    }
</style>
<script>
    $(function () {
        //获取url参数
        function getQueryValue(key) {
            var match = location.search.match(new RegExp(key + '=([^&]*)'));
            return match && match[1] || '';
        }
        // 当前页码
        var page = getQueryValue("page") || 1;
        page = parseInt(page);
        // 总页数
        var pageCount = {$total ?: '1'};
        if (pageCount == 1) {
            $("#page").hide();
        }
        $("#page").createPage({
            current: page,
            pageCount: pageCount,
            backFn: function (p) {
                //p是当前页码
                location.href = "?state=" + state + "&page=" + p;
            }
        });
    })
</script>

{/block}